{% load static %}
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script type="text/javascript" src="{% static 'jquery-1.2.6.js' %}"></script>
    <script>
        //onblur=""失去焦点
        //onfocus = ''获得焦点
        function shi() {
            //1获取文本框内容
            var uname = $("#uname").val()
            var pwd = $("#pwd").val()

            //2非空校验
            if (uname.length === 0) {
                $('#unamespan').html('*')
                $('#unamespan').css('color', 'red')
                $('#pwdspan').html('*')
                $('#pwdspan').css('color', 'red')
            } else {
                //3.判断唯一性
                $.get('/student/isonly/', {'uname': uname},function (data){
                   {#var r = JSON.parse(data)#}
                   {# console.log(r);#}
                   {# console.log(r.flag);#}
                    //4.根据服务器响应的信息进行2页面更新
                    if (data.flag===1){
                        $('#unamespan').html('此用户名已存在')
                        $('#unamespan').css('color', 'red')
                    }else {
                        $('#unamespan').html('对')
                        $('#unamespan').css('color', 'blue')
                    }
                })

            }


        }
    </script>
</head>
<body>
用户名：<input type="text" name="uname" id="uname" onblur="shi()"><span id="unamespan"></span>
{#密码：<input type="text" name="pwd" id="pwd" onblur="shi()"><span id="pwdspan"></span>#}
</body>
</html>